<%@ page import="ar.com.hakasoft.utils.NumberUtil" %>
<g:javascript library="egreso" />
<%
  def meses = [1:"Enero", 2:"Febrero", 3:"Marzo", 4:"Abril", 5:"Mayo", 6:"Junio", 7:"Julio", 8:"Agosto", 9:"Septiembre", 10:"Octubre", 11:"Noviembre", 12:"Diciembre"];
%>

<br><br>

<g:if test="${egresosList}">
	<H3>Egresos</H3>
	<br>
	<div id="bodyTable" style="width: 50%; align: center;"><div id="wrapper">
		<g:each in="${egresosList.hijos}" var="anio">
		<div id="headAnio_${anio?.clave}" class="contenedorHide" style="display: block;">
			<div id="toggleAnio_${anio?.clave}" class="headHide" onClick="javascript:animatedcollapse.toggle('contentEgresoAnio_${anio?.clave}');">
				<g:render template="/templates/headAnio" model="['anio': anio]"></g:render>
			</div>
			<div id="contentEgresoAnio_${anio?.clave}" class="contenedorHide" style="background-color: #f3f3f3;">
			
				<g:each in="${anio.hijos}" var="mes">
					<div id="headAnio_${anio?.clave}_Mes_${mes?.clave}">
						<div id="toggleAnio_${anio?.clave}_Mes_${mes?.clave}" class="headHide" onClick="javascript:animatedcollapse.toggle('contentEgresoAnio_${anio?.clave}_Mes_${mes?.clave}');">
							<g:render template="/templates/headMes" model="['mes': mes, 'meses':meses]"></g:render>
						</div>
						<div id="contentEgresoAnio_${anio?.clave}_Mes_${mes?.clave}" class="contenedorHide"  style="background-color: #c6c6c6;">
						
							<g:each in="${mes.hijos}" var="dia">
							<div id="headAnio_${dia?.clave}_Mes_${mes?.clave}_Dia_${dia?.clave}">
							<div id="toggleAnio_${anio?.clave}_Mes_${mes?.clave}_Dia_${dia?.clave}" class="headHide" onClick="javascript:animatedcollapse.toggle('contentEgresoAnio_${anio?.clave}_Mes_${mes?.clave}_Dia_${dia?.clave}');">
								<g:render template="/templates/headDiaEgreso" model="['dia': dia]"></g:render>
							</div>
						<script type="text/javascript">animatedcollapse.addDiv('contentEgresoAnio_${anio?.clave}_Mes_${mes?.clave}_Dia_${dia?.clave}', 'fade=0,speed=100');</script>
					</div>
				</g:each>
				
			</div>
			<script type="text/javascript">animatedcollapse.addDiv('contentEgresoAnio_${anio?.clave}_Mes_${mes?.clave}', 'fade=0,speed=100');</script>
				</div>
			</g:each>
			
			</div>
			<script type="text/javascript">animatedcollapse.addDiv('contentEgresoAnio_${anio?.clave}', 'fade=0,speed=100');</script>
			</div>
		</g:each>
	</div></div>

</g:if>
<g:else>
	<p><label>No hay egresos para los filtros seleccionados</label></p>
</g:else>

<script type="text/javascript">
	function miToggle(div, state) {
<%--		alert('div: ' + div.id + '\nstate: ' + state);--%>
	}
	
	animatedcollapse.ontoggle = function($, div, state) { miToggle(div, state); }
	animatedcollapse.init();
</script>